<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    姓名：<input type="text" name="uersname" class="username">
    <p class="info">提示信息</p>
    密码:<input type="text" name="pwd" /><br>
    <input type="submit" class="sub" value="提交" />
    <script>
        let subEle = document.querySelector(".sub");
        let usernameEle = document.querySelector(".username");
        usernameEle.onblur = function(){
          
            // let xhr = new XMLHttpRequest();
            // let username = usernameEle.value;
            // xhr.open("get","/checkusername?username="+username);
            // xhr.send();
            // xhr.onload = function () {
            //     console.log( xhr.responseText);
            //     let res = JSON.parse(xhr.responseText);
            //     console.log(res);
            //     document.querySelector(".info").innerHTML = res.info; 
            // }

            let  xhr = new XMLHttpRequest();
            let username = usernameEle.value;
            xhr.open("get",`/checkusername?username=${username}`);
            xhr.send();
            xhr.onload = function () {
                console.log(xhr.responseText);//json格式，字段带引号
                let res = JSON.parse(xhr.responseText);
                console.log(res);//对象格式,不格式化拿不到info,出现undefined
                document.querySelector(".info").innerHTML = res.info;
                
            }

        }

    </script>
</body>
</html>